const common = require('./webpack.common')
const { merge } = require('webpack-merge') // 合并 webpack 配置
const { CleanWebpackPlugin } = require('clean-webpack-plugin')
const { DefinePlugin } = require('webpack')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const OptimizeCssAssetsWebpackPlugin = require('optimize-css-assets-webpack-plugin')
const TerserWebpackPlugin = require('terser-webpack-plugin')

module.exports = merge(common, {
    mode: 'production',
    output: {
        filename: '[name]-[contenthash:8].bundle.js', // hash | chunkhash | contenthash
    },
    devtool: false,
    module: {
        rules: [
            {
                test: /\.less$/,
                use: [
                    // 'style-loader',
                    MiniCssExtractPlugin.loader,
                    'css-loader',
                    'less-loader'
                ]
            },
            {
                test: /\.css$/,
                use: [
                    // 'style-loader',
                    MiniCssExtractPlugin.loader,
                    'css-loader'
                ]
            }
        ]
    },
    plugins: [
        new CleanWebpackPlugin(),
        new HtmlWebpackPlugin({
            template: "./public/index.html",
            filename: 'index.html',
            minify: {
              removeComments: true, //去注释
              collapseWhitespace: true, //压缩空格
              removeAttributeQuotes: true //去除属性引用
        } // 对html代码进行压缩
        }),
        new DefinePlugin({
            BASE_URL: JSON.stringify(process.env.NODE_ENV)
        }),
        // new CopyWebpackPlugin({
        //     patterns: [{ from: "public/favicon.ico", to: "public" }] // 拷贝静态资源到输出目录
        // }),
        new MiniCssExtractPlugin() // 超过 150KB 提取公共 css 模块
    ],
    optimization: {
        sideEffects: true, // 开启副作用，需要 package.json 中也标记副作用文件
        usedExports: true, // 只导出外部使用的成员，标记未引用的代码
        concatenateModules: true, // 合并模块
        minimize: true, // 压缩并摇掉未引用的代码
        splitChunks: { // 提取公共模块
            chunks: 'all'
        },
        minimizer: [
            new OptimizeCssAssetsWebpackPlugin({
                filename: '[name]-[contenthash:8].bundle.css',
                cssProcessorOptions: {
                    discardComments: { remove: true } //移除注释
                }
            }), // 压缩公共 css 模块
            new TerserWebpackPlugin({
                parallel: true, //开启多线程来提高构建速度
                sourceMap: false,
                terserOptions: {
                    warnings: false, //不展示warning
                    compress: {
                        unused: true, //去除未使用的
                        drop_debugger: true, //移除debugger
                        drop_console: true //去除console
                    },
                    output: {
                        comments: false //去除注释
                    }
                }
            }) // 防止使用压缩公共css模块后重置 minimizer 数组，而把压缩 JS 代码插件移除掉
        ]
    }
})